<?php $this->regJs('jquery.touchSwipe.min') ?>
<style type="text/css">
    .bg {
        background: #eeeeee;
    }
    #indexBanner .item img{
    	width: 100%;
    	height: 140px;
    }
    .second_nav{
    	width: 100%;
    	background: #fff;
    	margin: 8px 0;
    }
    .second_nav li{
    	width: 100%;
    	text-align: center;
    }
    .second_nav li a{
    	display: block;
    	padding:10px 0;
    }
    .second_nav li img{
    	width: 32px;
    	height: 32px;
    }
    .second_nav li p{
    	font-size: 13px;
    	color: #333;
    	margin-top: 6px;
    }
    .notice{
    	background: #fff;
    	height: 42px;
    	line-height: 42px;
    	padding: 0 16px;
    }
    .notice .lf{
    	display: inline-block;
    	width: 100px;
    	height: 24px;
    	background: url(/images/remenjingying.png) no-repeat center center;
    	background-size: 100% 100%;
    	font-size: 12px;
    	color: #fff;
    	line-height: 24px;
    	text-align: center;
    	padding-right: 8px;
    	margin-top: 10px;
    }
    .notice .rt{
    	font-size: 12.6px;
    	color: #666;
    	border-left: 1px solid #eeeeee;
    	padding-left: 14px;
    }
    .product_con{
    	margin-top: 8px;
    	background: #fff;
    	padding:0 8px;
    }
    .product_con h1{
    	height: 54px;
    	line-height: 54px;
    	font-size: 16px;
    	color:#666;
    }
    .product_list li{
    	float: left;
    	width: calc((100% - 16px) / 3);
    	margin-left: 8px;
    	margin-bottom: 8px;
    	background: #fff;
    	border: 1px solid #efefef;
    	padding-bottom: 6px;
    }
    .product_list li:nth-child(3n + 1){
    	margin-left: 0;
    }
    .product_list li img{
    	width: 100%;
    	height: 100px;
    }
    .pro_name{
    	font-size: 16px;
    	color: #333;
    	line-height: 38px;
    	height: 38px;
    	padding-left: 6px;
    }
    .pro_price,.pro_ji{
    	font-size: 12.6px;
    	color: red;
    	padding-left: 6px;
    	line-height: 20px;
    }
    .jifen_con{
    	background: #dfb276;
    	padding: 0 8px 16px 8px;
    }
    .jifen_con li{
    	background: #fff;
    	width: calc((100% - 8px) / 2);
    	padding: 8px;
    }
    .jifen_con h1{
    	font-size: 16px;
    	color: #fff;
    	height: 40px;
    	line-height: 40px;
    	text-align: center;
    }
    .jifen_con img{
        width: 25%;
    }
    .ji_btn{
        display: inline-block;
        border: 1px solid #e03434;
        border-radius: 12px;
        padding:2px 10px;
        font-size: 12px;
        color:  #e03434;
        margin-top: 10px;
    }
</style>




<div id="indexBanner" data-ride="carousel" data-interval="2500" class="carousel index-carousel slide">
    <ol class="carousel-indicators">
        <li data-target="#indexBanner" data-slide-to="0" class="active"></li>
        <li data-target="#indexBanner" data-slide-to="1"></li>
        <li data-target="#indexBanner" data-slide-to="2"></li>
    </ol>   
    <!-- 轮播（Carousel）项目 -->
    <div class="carousel-inner">
        <div class="item active">
            <img src="/images/77f14c13-755d-4869-a046-9662521aa317.png">
        </div>
        <div class="item">
            <img src="/images/777ec9e4-c862-47c9-b5f1-5620e57e2cdb.png">
        </div>
        <div class="item">
            <img src="/images/5730a0ad-6ef0-4f78-926e-5923a1efca64.png">
        </div>
        <div class="item">
            <img src="/images/c31676f3-3471-418d-bfa6-93c70aa558ac.png">
        </div>
    </div>
</div> 

<ul class="second_nav flex-nowrap">
	<li>
		<a href="<?= url(['site/promotion']) ?>">
			<img src="/images/1_01.png">
			<p>促销专区</p>
		</a>
	</li>
	<li>
		<a href="<?= url(['site/mainHuangou']) ?>">
			<img src="/images/1_02.png">
			<p>积分兑换</p>
		</a>
	</li>
	<li>
		<a href="<?= url(['site/index']) ?>">
			<img src="/images/1_03.png">
			<p>积分乐园</p>
		</a>
	</li>
	<li>
		<a href="<?= url(['site/guide']) ?>">
			<img src="/images/1_04.png">
			<p>新手指引</p>
		</a>
	</li>
</ul>

<div class="notice">
		<a href="" class="clear_fl">
			<span class="lf">系统公告</span>
			<span class="rt">更多</span>
		</a>
</div>


<div class="product_con">
	<h1>促销推荐</h1>
	<ul class="product_list clear_fl">
        <?php foreach ($goods as $vo): ?>
		<li>
			<a href="<?= url(['site/productDetail', 'id' => $vo->goods_id]) ?>">
				<img src="<?= $vo->img ?>">
				<p class="pro_name"><?= $vo->goods_name ?></p>
				<p class="pro_price">售价 ￥<?= $vo->amount ?></p>
				<p class="pro_ji">送能源分 <?= $vo->score ?></p>
			</a>
		</li>
        <?php endforeach ?>
	</ul>
</div>
<div class="jifen_con">
	<h1>积分商城</h1>
	<ul class="clear_fl">
		<li class="lf">
			<a href="<?= url(['site/mainHuangou']) ?>">
				<div class="lf">
					<p class="ji_name">代销专区</p>
					<p class="ji_btn">商品代销转让 &gt;</p>
				</div>
				<img src="/images/photo24.png" class="rt">
			</a>
		</li>
		<li class="rt">
			<a href="<?= url(['site/mainHuangou']) ?>">
				<div class="lf">
					<p class="ji_name" style="color: #af13bd;">换购专区</p>
					<p class="ji_btn" style="color: #af13bd;border-color: #af13bd;">积分全额购物 &gt;</p>
				</div>
				<img src="/images/photo23.png" class="rt">
			</a>
		</li>
	</ul>
</div>




<script type="text/javascript">
	$(function(){
		$("#indexBanner").swipe({  
	        swipeLeft: function() { $(this).carousel('next'); },  
	        swipeRight: function() { $(this).carousel('prev'); },  
	    });  
	});
	
</script>